<template>
  <div class="ChildPage TablePage" v-loading="loading">
    <vb-page ref="page"  @onTableSelection = "doSelect">
      <template #headerBtn="scope">
        <el-button size="small" type="success"  icon="el-icon-share" @click="uploadKingdee(this.selection)">批量上传金蝶</el-button>
      </template>
      <template #headerSearch-append="scope">
        <span style="font-size: 12px; padding-right: 10px; color: #666666">物料</span>
        <el-select filterable remote :remote-method="e => getMaterialList(e)" v-model="scope.searchForm.materialNo" size="small" clearable class="material" placeholder="请输入物料编码或者名称" style="margin-right: 10px">
          <el-option v-for="item in materialList" :key="item.fNumber" :label="item.fNumber + '：' + item.fName + ' ' + item.fSpecification" :value="item.fNumber" />
        </el-select>
        <span style="font-size: 12px; padding-right: 10px; color: #666666">仓库</span>
        <el-select v-model="scope.searchForm.stockNo" clearable placeholder="请选择仓库" style="margin-right: 10px" size="small">
          <el-option v-for="item in dataList" :key="item.fNumber" :label="item.fName" :value="item.fNumber"></el-option>
        </el-select>
        <el-space>
          <span style="font-size: 12px; color: #666666">批次</span>
          <el-input size="small" v-model="scope.searchForm.batchNo" placeholder="请输入批次号" clearable></el-input>
        </el-space>
        <el-space>
          <span style="font-size: 12px; color: #666666">箱号</span>
          <el-input size="small" v-model="scope.searchForm.boxNo" placeholder="请输入箱号" clearable></el-input>
        </el-space>
      </template>
      <template #table-handle-prepend="scope">
        <el-button size="mini" type="text" icon="el-icon-edit" @click="gotoDetail(scope.row.billNo)">查看</el-button>
        <el-button size="mini" type="text" style="color:var(--el-color-success)" icon="el-icon-share" @click="toExport(scope.row.billNo)" :disabled="scope.row.status !== 'audit'">导出</el-button>
      </template>
      <template #table-stockNo="scope">
        {{ getStockName(scope.row.stockNo) }}
      </template>
      <template #table-count="scope">
        {{ scope.row.count? Number(scope.row.count.toFixed(2)): scope.row.count }}
      </template>
      <template #table-status="scope">
        <el-tag :type="scope.row.status === 'save'? 'info': 'success'">{{ scope.row.status === 'save'? '保存': '审核' }}</el-tag>
      </template>
      <template #table-isUpload="scope">
        <el-tag :type="scope.row.isUpload === 'yes'? 'success': 'info'" >{{ scope.row.isUpload === 'yes'? '已上传': '未上传' }}</el-tag>
      </template>
      <template #headerSearch-btn-append="{ searchForm }">
        <el-button type="warning" size="small" icon="el-icon-download" @click="doDownload(searchForm)">导出领料入库单</el-button>
      </template>
    </vb-page>
  </div>
</template>

<script>
export default {
  data() {
    return {
      materialLoading: false,
      reloadMaterial: false,
      materialList: [],
      dataList:[]
    }
  },
  async mounted() {
    await this.getStock()
    await this.selectStock()
  },
  methods: {
    async doDownload(searchForm) {
      this.loading = true
      try {
        let res = await this.callApi('download_prd_in_list', searchForm)
        if (!res.res) return
      } finally {
        this.loading = false
      }
    },
    async selectStock() {
      this.loading = true
      try {
        let res = await this.callApi('get_stock')
        if (!res.res) return
        this.dataList = res.data
      } finally {
        this.loading = false
      }
    },

    async uploadKingdee(billNoList){
      if (!this.selection || this.selection === 0){
        this.$message.error('没有选择行')
        return
      }
      const arrBillNo = [];//入库单号集合
      for (let i = 0;i<billNoList.length;i++){
        arrBillNo.push(billNoList[i].billNo)
      }

      try {
        let res = await this.callApi('sync_kingdee_in_stock',{billNoList:arrBillNo})
        console.log(res)
        if(!res.res){
          return
        }
        this.$message.success('上传成功')
        this.$refs.page.reload()
      }finally {
        this.loading = false
      }
    },
    doSelect(data) {
      this.selection = data
      this.selectionLength = this.selection.length;
      this.selectCount=0
      for (var i=0;i<this.selectionLength;i++){
        this.selectCount+=data[i].count
      }
      this.selectCount = parseFloat(this.selectCount).toFixed(2)
    },
    async getMaterialList(val) {
      if (!val) {
        this.materialList = []
        return
      }
      this.materialLoading = true
      try {
        const res = await this.callApi('get_material_by_key', { key: val, pageSize: 20 })
        if (!res.res) return
        this.materialList = res.data
      } finally {
        this.materialLoading = false
      }
    },
    toExport(billNo) {
      window.open(import.meta.env.VITE_EXPORT_URL + `materialBomInExport?billNo=${ billNo}`)
    },
    async getStock() {
      this.loading = true;
      try {
        let res = await this.$api.getChildDictionaryListByKeys({
          keys: ['stock']
        });
        if (!res.res) return;
        this.stockList = res.stock;
      } finally {
        this.loading = false;
      }
    },
    /**
     * 获取状态名
     */
    getStockName(val) {
      if (this.stockList && this.stockList.length > 0) {
        for(let i = 0; i < this.stockList.length; i++) {
          if (this.stockList[i].key === val) {
            return this.stockList[i].name;
          }
        }
      }
      return '';
    },
    gotoDetail(billNo = '') {
      let url = '/produce/materialBomInDetail'
      if (billNo) {
        url += `?billNo=${ billNo }`
      }
      this.$router.push(url)
    }
  }
}
</script>

<style scoped>

</style>
